{% extends "admin/admin_base.html" %}
{% block style %}

        input[type='number']{
            width: 100px;
        }
        .btn{
            margin-right: 30px;

        }
        .del{
            color:red;
            border: 1px solid red;
            text-decoration: line-through;
        }
        .recommend{
            color: blue ;
            border: 1px solid blue;
        }
{% endblock %}
{% block content %}

		<div class="container-fluid">
			<div class="row">

				<div class="col-md-12">
					<!-- 媒体列表 -->
                    <h3>文章管理

                    <small>
                            <a href="{{ url_for("admin_app.article_post") }}">
                                添加文章
                            </a>
                        </small>
                    </h3>
                    <div class="panel">
                        <form action=""  method="post" class="form-horizontal" >
                            <div class="form-group">
                                <label for="q" class="col-xs-2 control-label">关键字</label>
                                <div class="col-xs-10">
                                    <input type="text" name="q" class="form-control">
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="field" class="col-xs-2 control-label">查询字段</label>
                                <div class="col-xs-10">
                                    <select name="field" class="form-control">
                                        <option value="title">根据标题查找</option>
                                        <option value="content">根据文章内容查找</option>

                                    </select>
                                </div>
                            </div>


                            <div class="form-group">
                                <label for="排序" class="col-xs-2 control-label">排序</label>
                                <div class="col-xs-2">
                                   <select name="order" class="form-control">
                                        <option value="1" checked>按照id升序排序</option>
                                        <option value="2">按照id降序排序</option>
                                    </select>
                                </div>
                            </div>

                            <div class="form-group ">

                                <input type="submit" name="search" class="btn btn-primary pull-right" value="立即搜索">
                            </div>

                        </form>
                    </div>
                    <table class="table">
                        <tr>
                            <td>总页数:{{ pages }}/总记录:{{ total }}</td>
                        </tr>
                    </table>
					<table class="table table-bordered ">

                        <tr>
                            <th>文章ID</th>
                            <th>文章标题</th>
                            <th>作者</th>
                            <th>发布日期</th>
                            <th>操作</th>
                        </tr>
                        {% for article in articles %}
                        <tr id="article_{{ article.id }}">
                            <td>{{ article.id }}</td>
                            <td><a href="{{ url_for("article_app.view", article_id=article.id) }}" target="_blank">{{ article.title }}</a></td>
                            <td>{{ article.author }}</td>
                            <td>{{ article.pubdate }}</td>
                            <td>
                                <a href="javascript:recommend_article({{ article.id }});"  >推荐</a>
                                <a href="javascript:del_article({{ article.id }});" >删除</a>
                            </td>
                        </tr>
                        {% endfor %}
                    </table>
					<!--  -->
					<ul class="pagination">
                        {% for page in pageList %}
                            {% if page!=None %}
						<li><a href="{{ url_for("admin_app.article_list", page=page) }}">{{ page }}</a></li>
                            {% else %}
                            <li><a href="#">...</a></li>
                            {% endif %}
						{% endfor %}
					</ul>
				</div>


				</div>
			</div>
		</div>
     <script>
     // 删除处理
      function del_article(article_id){
          url = '{{ url_for("admin_app.article_delete")}}'
          send_data(url,{"article_id":article_id})
      }
      // 推荐处理
      function recommend_article(article_id){
          url = '{{ url_for("admin_app.article_recommend")}}'
          send_data(url,{"article_id":article_id})
      }

      function send_data(url,data){
                    $.ajax({
                        url: url,
                        type: "post",
                        data:data,
                        beforeSend:function(xhr){
                            xhr.setRequestHeader("X-CSRFToken", "{{  csrf_token() }}")
                        },
                        success: function (data) {
                            if (data.res=="success"){
                                // 根据删除还是推荐
                                // 设置操作行样式

                                $("#article_"+data.id).toggleClass(data.type)
                            }

                        }
                    })
                }


        {#window.onload=function(){#}
        {#    table = $(".table")#}
        {#    table.on("click",del)#}
        {#    #}
        {# } #}
    </script>
{% endblock %}

